<include file="public@header" />
</head>
<body>
<div class="wrap js-check-wrap">
	<div class="nav nav-tabs">
		<h4>数据统计</h4>
	</div>
	<form class="well form-inline margin-top-20" method="post" action="">
		时间:
		<input type="text" class="form-control js-bootstrap-date" name="start_time" id="start_time"
			   value="{$where_r.start_time|default=''}"
			   style="width: 140px;" autocomplete="off">-
		<input type="text" class="form-control js-bootstrap-date" name="end_time" id="end_time"
			   value="{$where_r.end_time|default=''}"
			   style="width: 140px;" autocomplete="off"> &nbsp; &nbsp;
		<input type="button" id="choose_time" class="btn btn-primary" value="筛选"/>
	</form>
</div>
<div>
	<div id="container" style="width:1000px; margin: 0 auto"></div>
</div>
<script src="__STATIC__/js/admin.js"></script>
<script src="__STATIC__/js/echarts/echarts.min.js"></script>
<script>
    $(function () {
        var chart = echarts.init(document.getElementById('container'));
        var height = 0;
        option = {
            tooltip : {
                trigger: 'axis',
                axisPointer : {            // 坐标轴指示器，坐标轴触发有效
                    type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            legend: {
                data: []
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis:  {
                type: 'value'
            },
            yAxis: {
                axisLabel:{
                    interval: 0
				},
                type: 'category',
                data: []
            },
            series: [

            ]
        };
        $('#choose_time').click(function () {
            getdata();
        });
        getdata();
        $(window).resize(function () {
            chart.resize();
        });

        function getdata(){
            var params = {
                start_time: $('#start_time').val(),
                end_time: $('#end_time').val(),
            };
            option.series = [];//清空原数据
            $.ajax({
                url: "{:url('getdata')}",
                type: 'post',
                data: params,
                dataType: "json",
                success: function (data) {
                    $.each(data.data,function(i,e) {
                        option.legend.data.push(e.title);
                        var serie = {
                            type: 'bar',
                            stack: '总量',
                            label: {
                                normal: {
//                                show: true,
                                    formatter:function(value){
                                        if(value.data === 0) {
                                            return '';
                                        }
                                        return value.data + '';
                                    }
                                }
                            },
                            data: []
                        };
                        serie.name = e.title;
                        $.each(e.data,function(j,val){
                            if(!i) {
                                height += 40;
                                option.yAxis.data.push(val.name);
                            }
                            serie.data.push(val.count);
                        })
                        option.series.push(serie);
                    });


                    $('#container').css('height',height+'px');
                    chart.setOption(option);
					chart.resize();
                }
            });
        }
    });
</script>
</body>
</html>